<template lang="html">
  <div class="full">
    <div class="top_blank">
      <span @click="back()"><</span>
      <h3>{{ title }}</h3>
    </div>
    <ul class="zhuce_ul_a">
      <li>
        <img src="../../static/userword.png" alt="">
        <input v-model="User" type="text" name="" value="" placeholder="请输入用户名">
      </li>
      <li>
        <img src="../../static/mbquestion.png" alt="">
        <input v-model="Mibao" class="mibaoquestion" type="text" name="" value="" placeholder="请输入您的真实姓名">
      </li>
    </ul>
    <span @click="find_pass()" class="gaimi_sure">确认</span>
  </div>
</template>

<script>
export default {
  data(){
    return{
      title:'找回密码',
      User:'',
      Mibao:'',
      flag:1
    }
  },
  methods:{
    back(){
      this.$router.push({name:'one'})
    },
    find_pass(){
      if (this.flag == 1) {
        this.axios.get('http://txspring.cn:8080/mibao?user='+this.User+'&mibao='+this.Mibao).then(res=>{
          console.log(res);
          if (res.data.code == 0) {
            this.$Message.info(res.data.des);
          }else{
            this.$Message.info({
                      content: '您的密码是'+res.data,
                      duration: 10,
                      closable: true
                  });
          }
        })
        this.flag = 0;
        setTimeout(()=>{
          this.flag = 1;
        },1500);
      }

    }
  }
}
</script>

<style lang="css">
.gaimi_sure{
	color: white;
	line-height: 2.5rem;
	background: #00b0ec;
	display: inline-block;
	height: 2.5rem;
	width: 90%;
	border-radius: .5rem;
	margin-top: 40px;
}
.top_blank{
  background-color: #00b0ec;
  text-align: center;
  color: white;
  height: 3rem;
  line-height: 3rem;
}
.top_blank>h3{
  display: inline-block;
  font-size: 1.5rem;
}
.top_blank>span{
  float: left;
  display: inline-block;
  font-size: 1.5rem;
}
.zhuce_ul_a{
  width: 90%;
  padding: 0;
  margin: auto;
  margin-top: 10px;
}
.zhuce_ul_a>li{
  list-style: none;
  text-align: left;
  width: 100%;
  line-height: 3.5rem;
  border-bottom: 1px solid lightgray;
  margin: auto;
}
.zhuce_ul_a>li>input{
    outline: none;
    border: none;
}
.zhuce_ul_a>li img{
  width: 2rem;
  height: 2rem;
  vertical-align: middle;
}
</style>
